<?xml version="1.0" encoding="utf-8" ?>
<%@page import="comWorld.user.UserInfo"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<jsp:include page="/commonPart/htmlHeader2.jsp">
	<jsp:param name="title" value="修改个人资料-${userInfo.name}的个人空间-CommonWorld" />
</jsp:include>
<body>
<div id = "CW_Screen" >
	<jsp:include page= "/commonPart/bodyHeader2.jsp" ></jsp:include>
	<div id = "CW_Content">
		<div id = "SpaceLeft">
			<div class = "AdminNav clearfix">
				<a href = "${userUrls.home}" class = "u" title = "返回我的空间首页">
					<img src = "${userInfo.headImage}" alt = "${userInfo.name}" class = "SmallPortrait" user = "${userInfo.id}" />	
				</a>
				<span class = "h">空间管理</span>
			</div>
			<div id = "AdminMenus" class = "Mod">
				<ul>
					<li class = "caption">
						<strong>个人信息管理</strong>
						<ol>
							<li><a href = "${userUrls.adminInbox}">站内留言</a></li>
							<li class = "active"><a href = "${userUrls.adminProfile}">修改个人资料</a></li>
							<li><a href = "${userUrls.adminChqwd}">更改登录密码</a></li>
							<li><a href = "${userUrls.adminPortrait}">更改头像图片</a></li>
						</ol>
					</li>
				</ul>
				<ul>
					<li class = "caption">
						<strong>博客管理</strong>
						<ol>
							<li><a href = "${userUrls.adminNewBlog}">发表博客</a></li>
							<li><a href = "${userUrls.adminDrafts}">草稿箱(${draftInfos.count})</a></li>
							<li><a href = "${userUrls.adminBlogCatalogs}">博客设置/分类管理</a></li>
						</ol>
					</li>
				</ul>
			</div>		
		</div>
		<div class = "SpaceList" id = "AdminBody">
			<div class = "TopBar">
			</div>
			<div class = "AdminHead">
				<ul class = "Tabs">
					<li>
						<a class = "active" id = "Trigger_BasicForm" href = "javascript:switch_to_form('BasicForm')">会员基本</a>
					</li>
					<li><a id = "Trigger_ContactForm" href = "javascript:switch_to_form('ContactForm')">联系信息</a></li>
				</ul>
			</div>
			<div class = "AdminContent MainForm" id = "ProfileForms">
				<form class = "AutoCommitJSONForm" id = "BasicForm" action = "/user/profile/updateUserBasicInfo" method = "post"> 
					<input name = "user_code" type = "hidden" value = "userInfo">
					<table>
						<tr>
							<th>登录账号</th>
							<td>${userInfo.loginEmail}</td>
						</tr>
						<tr>
							<th>昵称</th>
							<td>
								<input name = "name" class = "TEXT" type = "text" size = "20" maxLength = "16" value = "${userInfo.name}" />
								<span class = "Info" id = "name_msg">不能超过10个字</span>
							</td>
						</tr>
						<tr>
							<th>性别</th>
							<td>
								<c:choose>
									<c:when test="${userInfo.sex == '男'}">
										<input name = "sex" type = "radio" checked="checked" value = "男">男</input>
										<input name = "sex" type = "radio" value = "女">女</input>
									</c:when>
									<c:when test = "${userInfo.sex == '女'}">
										<input name = "sex" type = "radio" value = "男">男</input>
										<input name = "sex" type = "radio" checked="checked" value = "女">女</input>
									</c:when>
								</c:choose>
							</td>
						</tr>
						<tr>
							<th>出生年月</th>
							<td>
								<%
									String bothday = ((UserInfo)session.getAttribute("visitorInfo")).getBothday();
									String[] ymd = new String[3];
									for (int i = 0; i < 3; i++) {
										ymd[i] = "--";
									}
									if (bothday != null) {
										String[] real = bothday.split("-|/");										
										for (int i = 0; i < real.length; i++) {
											if (real[i].length() != 0) {
												ymd[i] = real[i];
											}
										}
									}
									pageContext.setAttribute("y", ymd[0]);
									pageContext.setAttribute("m", ymd[1]);
									pageContext.setAttribute("d", ymd[2]);
								%>
								<select name='y'>
									<option value='${y == "--" ? 0 : y}'>${y}</option><option value='2001'>2001</option><option value='2000'>2000</option>
									<option value='1999'>1999</option><option value='1998'>1998</option><option value='1997'>1997</option>
									<option value='1996'>1996</option><option value='1995'>1995</option><option value='1994'>1994</option>
									<option value='1993'>1993</option><option value='1992'>1992</option><option value='1991'>1991</option>
									<option value='1990'>1990</option><option value='1989'>1989</option><option value='1988'>1988</option>
									<option value='1987'>1987</option><option value='1986'>1986</option><option value='1985'>1985</option>
									<option value='1984'>1984</option><option value='1983'>1983</option><option value='1982'>1982</option>
									<option value='1981'>1981</option><option value='1980'>1980</option><option value='1979'>1979</option>
									<option value='1978'>1978</option><option value='1977'>1977</option><option value='1976'>1976</option>
									<option value='1975'>1975</option><option value='1974'>1974</option><option value='1973'>1973</option>
									<option value='1972'>1972</option><option value='1971'>1971</option><option value='1970'>1970</option>
									<option value='1969'>1969</option><option value='1968'>1968</option><option value='1967'>1967</option>
									<option value='1966'>1966</option><option value='1965'>1965</option><option value='1964'>1964</option>
									<option value='1963'>1963</option><option value='1962'>1962</option><option value='1961'>1961</option>
									<option value='1960'>1960</option><option value='1959'>1959</option><option value='1958'>1958</option>
									<option value='1957'>1957</option><option value='1956'>1956</option><option value='1955'>1955</option>
									<option value='1954'>1954</option><option value='1953'>1953</option><option value='1952'>1952</option>
									<option value='1951'>1951</option><option value='1950'>1950</option>
								</select> 年
            					<select name='m'><option value='${m == "--" ? 0 : m}'>${m}</option><option value='1'>1</option><option value='2'>2</option>
            						<option value='3'>3</option><option value='4'>4</option><option value='5'>5</option><option value='6'>6</option>
            						<option value='7'>7</option><option value='8'>8</option><option value='9'>9</option><option value='10'>10</option>
            						<option value='11'>11</option><option value='12'>12</option>
            					</select> 月
           						<select name='d'><option value='${d == "--" ? 0 : d}'>${d}</option><option value='1'>1</option><option value='2'>2</option>
           							<option value='3'>3</option><option value='4'>4</option><option value='5'>5</option><option value='6'>6</option>
           							<option value='7'>7</option><option value='8'>8</option><option value='9'>9</option><option value='10'>10</option>
           							<option value='11'>11</option><option value='12'>12</option><option value='13'>13</option><option value='14'>14</option>
           							<option value='15'>15</option><option value='16'>16</option><option value='17'>17</option><option value='18'>18</option>
           							<option value='19'>19</option><option value='20'>20</option><option value='21'>21</option><option value='22'>22</option>
           							<option value='23'>23</option><option value='24'>24</option><option value='25'>25</option><option value='26'>26</option>
           							<option value='27'>27</option><option value='28'>28</option><option value='29'>29</option><option value='30'>30</option>
           							<option value='31'>31</option>
           						</select> 日				
							</td>
						</tr>
						<tr>
							<th>居住地区</th>
							<td>
								<select onchange = "showcity(this.value, document.getElementById('userCity'));" name = "province" id = "userProvince">
									<option value=''>--请选择省份--</option>
										<option value=北京>北京</option> 
										<option value=上海>上海</option> 
										<option value=广东>广东</option> 
										<option value=江苏>江苏</option> 
										<option value=浙江>浙江</option> 
										<option value=重庆>重庆</option> 
										<option value=安徽>安徽</option> 
										<option value=福建>福建</option> 
										<option value=甘肃>甘肃</option> 
										<option value=广西>广西</option> 
										<option value=贵州>贵州</option> 
										<option value=海南>海南</option> 
										<option value=河北>河北</option> 
										<option value=黑龙江>黑龙江</option> 
										<option value=河南>河南</option> 
										<option value=湖北>湖北</option> 
										<option value=湖南>湖南</option> 
										<option value=江西>江西</option> 
										<option value=吉林>吉林</option> 
										<option value=辽宁>辽宁</option> 
										<option value=内蒙古>内蒙古</option> 
										<option value=宁夏>宁夏</option> 
										<option value=青海>青海</option> 
										<option value=山东>山东</option> 
										<option value=山西>山西</option> 
										<option value=陕西>陕西</option> 
										<option value=四川>四川</option> 
										<option value=天津>天津</option> 
										<option value=新疆>新疆</option> 
										<option value=西藏>西藏</option> 
										<option value=云南>云南</option> 
										<option value=香港>香港特别行政区</option> 
										<option value=澳门>澳门特别行政区</option>
										<option value=台湾>台湾</option> 
										<option value=海外>海外</option>
								</select>
								<select name = "city" id = "userCity"></select>
								<script src="/js/getcity.js"></script></td>
							</td>
						</tr>
						<tr>
							<th>个性签名<br />不超过100字</th>
							<td>
								<textarea name = "signature" style = "width: 300px; height: 100px;" class = "TEXT">${userInfo.label}</textarea>
							</td>
						</tr>
						<tr><th colspan="2"></th></tr>
						<tr>
							<th></th>
							<td>
								<input type = "submit" value = '保存修改' class = 'BUTTON SUBMIT' />
							</td>
						</tr>
					</table>
				</form>
				<form class = "AutoCommitJSONForm" id = "ContactForm" style = "display: none" action = "${initParam.webRootUrl}/user/profile/updateUserContactInfo" method = "post"> 
					<input name = "user_code" type = "hidden" value = "userContactInfo">
					<table>
						<tr>
							<th>联系电话</th>
							<td>
								<input type = "text"  name = "tel" size = "20" class = "TEXT" value = "${userContactInfo.tel}"/>&nbsp;&nbsp;
								<c:choose>
									<c:when test="${userContactInfo.telOpen == 1}">
										<input type = "checkbox" name = "open_tel" value = "1" checked /> 对外公开
									</c:when>
									<c:when test="${userContactInfo.telOpen == 0}">
										<input type = "checkbox" name = "open_tel" value = "0"/> 对外公开
									</c:when>
								</c:choose>
							</td>
						</tr>
						<tr>
							<th>邮箱地址</th>
							<td>
								<input type = "text" id = "f_email" name = "email" size = "40" class = "TEXT" value = "${userContactInfo.email}" />&nbsp;&nbsp;
								<c:choose>
									<c:when test="${userContactInfo.emailOpen == 1}">
										<input type = "checkbox" name = "open_email" value = "1" checked /> 对外公开
									</c:when>
									<c:when test="${userContactInfo.emailOpen == 0}">
										<input type = "checkbox" name = "open_email" value = "0" /> 对外公开
									</c:when>
								</c:choose>
								<a href = "javascript:;" onclick = "javascript:$('#f_email').val('${userInfo.loginEmail}');">使用跟账号相同Email地址</a>
							</td>
						</tr>
						<tr>
							<th>QQ</th>
							<td>
								<input type = "text" name = "qq" size = "20" class = "TEXT" value = "${userContactInfo.qq}" />
							</td>
						</tr>
						<tr>
							<th colspan="2"></th>
						</tr>
						<tr>
							<th></th>
							<td>
								<input type = "submit" value = "保存修改" class = "BUTTON SUBMIT" />
								<input type = "reset" class = "BUTTON" />
							</td>
						</tr>
					</table>
				</form>
				<span id = "error_msg" style = "display: none"></span>
				<%
					String adress = ((UserInfo)session.getAttribute("visitorInfo")).getAddress();
					String[] pc = {null, null};
					if (adress != null) {
						pc[0] = adress.split("-")[0];
						pc[1] = adress.split("-")[1];
					}
					pageContext.setAttribute("priv", pc[0]);
					pageContext.setAttribute("city", pc[1]);
				%>
				<script>
					function switch_to_form(form_id) {
						$('.AdminContent form').hide();
						$('#' + form_id).show();
						$('.AdminHead ul li a').removeClass('active');
						$('#Trigger_' + form_id).addClass('active');
						$('#error_msg').hide();
					}
					$().ready(function() {
						init_province_and_city(document.getElementById('userProvince'), '${priv}', document.getElementById('userCity'), '${city}');
					});	
					
					$(document).ready(function() {
						$('.AutoCommitJSONForm').ajaxForm({
							dataType: 'json',
							success: function(json) {
								$('#error_msg').hide();
								if (json.error != 0) {
									$('#error_msg').html("<span class = 'error_msg'>" + json.msg + "</span>");
								} else {
									$('#error_msg').html("<span class = 'ok_msg'>" + json.msg + "</span>");
								}
								$('#error_msg').show();
							}
						});
					});
				</script>
			</div>
		</div>
	</div>
	<div class = "clear"></div>
	<div id = "footer"></div>
</div>
</body>
</html>